<!--
  * 费用信息
  *
-->
<template>
  <div>
    <a-table :dataSource="tableData" :columns="columns" :scroll="{ x: 'max-content', y: 427 }" :pagination="false" rowKey="id" size="small" bordered> </a-table>
  </div>
</template>
<script setup lang="ts">
import _ from 'lodash'
const props = defineProps({
  enterpriseId: {
    type: Array,
    default: null
  }
})

const columns = reactive([
  {
    title: '费用类别',
    dataIndex: ['category', 'category_name']
  },
  {
    title: '费用金额(元)',
    dataIndex: 'amount'
  },
  {
    title: '类别备注',
    dataIndex: 'remark'
  }
])

const tableData = ref([])
watch(
  () => props.enterpriseId,
  (e) => {
    if (e) {
      tableData.value = e
    }
  },
  { immediate: true }
)
</script>

<style scoped lang="less">
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 20px 0;
}

.button-style {
  margin: 0 10px;
}
</style>
